<template>
  <div class="email-dia" style="height: 350px;overflow: auto;">


    <el-form
      class="dia-form"
      ref="elForm"
      :model="formData"
      :rules="rules"
      size="small"
      label-width="127px"
      style="margin-left:0px;padding: 24px 24px 24px 24px;"
    >
      <div v-show="islink == 0">
        <el-col :span="24">
          <div class="tips" name="jichu">基础属性</div>
        </el-col>

        <el-col :span="24">
          <el-form-item label="标签名称" prop="field101">
            <el-input
              v-model="formData.field101"
              placeholder="标签名称"
              clearable
              :style="{ width: '100%' }"
            >
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
            <el-form-item  label="标签分类" prop="field105">
                 <el-select v-model="formData.field105" placeholder="请选择标签分类" clearable :style="{width: '100%'}">
                   <el-option v-for="(item, index) in field102Options" :key="index" :label="item.label"
                     :value="item.value" :disabled="item.disabled"></el-option>
                 </el-select>
               </el-form-item>
        </el-col>
        <el-col :span="12">
           <el-form-item  prop="field114">
             <el-select v-model="formData.field111" placeholder="请选择" clearable :style="{width: '100%'}">
                        <el-option v-for="(item, index) in field111Options" :key="index" :label="item.label"
                          :value="item.value" :disabled="item.disabled"></el-option>
                      </el-select>

           </el-form-item>
         </el-col>
       <el-col :span="12">
          <el-form-item label="标签类型" prop="field114">
             <el-select v-model="formData.field114" placeholder="请选择标签类型" clearable :style="{width: '100%'}">
                      <el-option v-for="(item, index) in field114Options" :key="index" :label="item.label"
                        :value="item.value" :disabled="item.disabled"></el-option>
                    </el-select>

          </el-form-item>
        </el-col>

        <el-col :span="12">
          <el-form-item label="数据类型" prop="field108">
             <el-select v-model="formData.field108" placeholder="请选择数据类型" clearable :style="{width: '100%'}">
                      <el-option v-for="(item, index) in field108Options" :key="index" :label="item.label"
                        :value="item.value" :disabled="item.disabled"></el-option>
                    </el-select>
          </el-form-item>
        </el-col>

        </div>



 <div v-show="islink == 0">
        <el-col :span="24">
          <div class="tips" name="jichu">其他配置</div>
        </el-col>
        <el-col :span="12">
                     <el-form-item label="危害系数" prop="field121">
                       <el-input
                         v-model="formData.field121"
                         placeholder="危害系数"
                         clearable
                         :style="{ width: '100%' }"
                       >
                       </el-input>
                     </el-form-item>
        </el-col>

        <el-col :span="12">
              <el-form-item label="行为阶段" prop="field113">
               <el-select v-model="formData.field113" placeholder="请选择行为阶段" clearable :style="{width: '100%'}">
                         <el-option v-for="(item, index) in field113Options" :key="index" :label="item.label"
                           :value="item.value" :disabled="item.disabled"></el-option>
                       </el-select>
               </el-form-item>
       </el-col>
       <el-col :span="24">
         <el-form-item label="是否生成事件"   v-model="radio" >
             <el-radio-group v-model="radio" >
                 <el-radio :label="1" >是</el-radio>
                 <el-radio :label="2">否</el-radio>
               </el-radio-group>
         </el-form-item>

       </el-col>
    <el-col >
          <el-form-item label="事件名称" prop="field199"  v-if="radio==1">
            <el-input
              v-model="formData.field199"
              placeholder="事件名称"
              clearable
              :style="{ width: '100%' }"
            >
            </el-input>
          </el-form-item>
        </el-col>
        </div>




    </el-form>
  </div>
</template>
<script>
export default {
  components: {},
  props: [],
  data() {
    return {
      islink: 0,
      radio: 2,
      formData: {

      },
          field102Options: [{
             "label": "主机",
             "value": 1
           }, {
             "label": "人员",
             "value": 2
           }, {
             "label": "账号",
             "value": 3
           }],
           field106Options: [{
                 "label": "信息中心",
                 "value": 1
               }],
          field114Options: [{
                        "label": "事实标签",
                        "value": 1
                      },{
                        "label": "模型标签",
                        "value": 2
                      },{
                        "label": "衍生标签",
                        "value": 3
                      }],
          field115Options: [{
                 "label": "接入交换机",
                 "value": 1
          },{
                 "label": "汇聚交换机",
                 "value": 2
          },{
                 "label": "核心交换机",
                 "value": 3
          }],

          field107Options: [{
                  "label": "是",
                  "value": 1
                }, {
                  "label": "否",
                  "value": 2
                }],
          field108Options: [{
                        "label": "string",
                        "value": 1
                      },{
                        "label": "bool",
                        "value": 2
                      },{
                        "label": "numeric",
                        "value": 3
                      }],
                field109Options: [{
                  "label": "库存中",
                  "value": 1
                }, {
                  "label": "待入网",
                  "value": 2
                }, {
                  "label": "已入网",
                  "value": ""
                }, {
                  "label": "维修中",
                  "value": ""
                }, {
                  "label": "退网中",
                  "value": ""
                }, {
                  "label": "已退网",
                  "value": ""
                }, {
                  "label": "报废中",
                  "value": ""
                }, {
                  "label": "已报废",
                  "value": ""
                }],
  field110Options: [{
        "label": "Windows",
        "value": 1
      }, {
        "label": "国产专用",
        "value": 2
      }, {
        "label": "普通国产",
        "value": 3
      }, {
        "label": "未知",
        "value": 4
      }],
  field111Options: [{
        "label": "分类",
        "value": 1
      }, {
        "label": "活跃度",
        "value": 2
      },
      {
        "label": "密级",
        "value": 3
      },
      {
        "label": "攻击",
        "value": 4
      },
      {
        "label": "风险项",
        "value": 5
      },
      {
        "label": "风险等级",
        "value": 6
      },
      {
        "label": "状态",
        "value": 7
      },
      {
        "label": "主题",
        "value": 8
      },
       {
        "label": "配置合规",
        "value": 9
      },
       {
        "label": "异常行为",
        "value": 10
      },
       {
        "label": "属性",
        "value": 11
      },
       {
        "label": "用途",
        "value": 12
      },
       {
        "label": "备案",
        "value": 13
      },
       {
        "label": "其他",
        "value": 14
      }],

 field112Options: [{
        "label": "宝兰德",
        "value": ""
      }, {
        "label": "瀚高",
        "value": 1
      }, {
        "label": "锐捷",
        "value": ""
      }, {
        "label": "华为",
        "value": ""
      }],
 field113Options: [{
        "label": "无类型",
        "value": 1
      }, {
        "label": "探测扫描",
        "value": 2
      },{
        "label": "渗透攻击",
        "value": 3
      }, {
        "label": "入侵检测",
        "value": 4
      },{
        "label": "安转工具",
        "value": 5
      }, {
        "label": "恶意行为",
        "value": 6
      }],
field122Options: [{
        "label": "机密",
        "value": 1
      }, {
        "label": "秘密",
        "value": ""
      }, {
        "label": "内部",
        "value": ""
      }, {
        "label": "公开",
        "value": ""
      }, {
        "label": "绝密",
        "value": ""
      }],
    field123Options: [{
              "label": "一般",
              "value": 1
            }, {
              "label": "重要",
              "value": 2
            }, {
              "label": "非常重要",
              "value": 3
            }],
      field124Options: [{
        "label": "运维单位1",
        "value": 1
      }, {
        "label": "运维单位2",
        "value": ""
      }],
      field127Options: [{
        "label": "运维终端",
        "value": 1
      }, {
        "label": "办公终端",
        "value": 2
      }, {
        "label": "未知",
        "value": 3
      }],

      rules: {
        field110: [
          {
            required: true,
            message: '请输入单行文本',
            trigger: 'blur'
          }
        ],
        field101: [
          {
            required: true,
            message: '请输入',
            trigger: 'blur'
          }
        ],
        field102: [{
                 required: true,
                 message: '请选择是否国产化',
                 trigger: 'change'
        }],
        field103: [
          {
            required: true,
            message: '请输入发送邮件地址',
            trigger: 'blur'
          }
        ],
        field105: [
          {
            required: true,
            message: '请输入发送邮件端口',
            trigger: 'blur'
          }
        ],
        field107: [
          {
            required: true,
            message: '请输入，多个用英文;隔开',
            trigger: 'blur'
          }
        ],
        field108: [
          {
            required: true,
            message: '请输入，多个用英文;隔开',
            trigger: 'blur'
          }
        ],
        field109: [
          {
            required: true,
            message: '请输入，多个用英文;隔开',
            trigger: 'blur'
          }
        ],
        field111: [
          {
            required: true,
            message: '请输入在用状态',
            trigger: 'blur',
            }
          ],
        field112: [
          {
            required: true,
            message: '请输入，多个用英文;隔开标题',
            trigger: 'blur'
          }
        ],
        field113: [
          {
            required: true,
            message: '请输入正文',
            trigger: 'blur'
          }
        ]
      }
    }
  },
  computed: {},
  watch: {},
  created() {
  },
  mounted() {
  },
  methods: {}
}
</script>
<style scoped lang="scss">
.email-dia {
  display: flex;
  height: 540px;
  width: 100%;
  justify-content: space-between;
  max-height: 100vh;

  aside {
    padding: 0;
    width: 140px !important;
    position: absolute;
    height: 540px;
    background: #fff;
    border-right: 1px solid #e8e8e8;

    .option-group {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: flex-start;

      li {
        display: flex;
        align-items: center;
        width: 100%;
        padding: 15px 0 15px 24px;
        cursor: pointer;
        font-size: 14px;
        color: #303032;
        font-weight: 400;

        &.activeLink {
          border-right: 2px solid #2979ff;
          background: #dfecff;
          color: #2979ff;
        }
      }
    }
  }

  .dia-form {
    margin-left: 140px;
    padding: 24px 80px 24px 24px;
    width: 100%;
  }
}
</style>
